<template>
  <div class="app-container">
    <div style="width: 1024px;margin: 0 auto">
    <el-form ref="submitParams" :model="submitParams" :rules="rules" label-width="160px">
      <el-row>
        <el-col :span="12">
          <el-form-item label="系统编号" prop="sysCode">
            <el-select v-model="submitParams.sysCode" clearable placeholder="内部机构号" style="width: 100%">
              <el-option
                v-for="dict in dictMap.ORGAN_SYSTYPE_BRANCH"
                :key="dict.value"
                :label="`${dict.value}-${dict.text}`"
                :value="dict.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row v-if="this.submitParams.sysCode === 'HVPS'">
        <el-col :span="12">
          <el-form-item label="查询类型" prop="inqTypeHVPS">
            <el-select v-model="submitParams.inqTypeHVPS" clearable placeholder="查询类型" style="width: 100%">
              <el-option
                v-for="dict in dictMap.INQ_TYPE_314_HVPS"
                :key="dict.value"
                :label="`${dict.value}-${dict.text}`"
                :value="dict.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row v-if="this.submitParams.sysCode === 'BEPS' || this.submitParams.sysCode === 'IBPS'">
        <el-col :span="12">
          <el-form-item label="查询类型" prop="inqType">
            <el-select v-model="submitParams.inqType" clearable placeholder="查询类型" style="width: 100%">
              <el-option
                v-for="dict in dictMap.INQ_TYPE_314"
                :key="dict.value"
                :label="`${dict.value}-${dict.text}`"
                :value="dict.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="12">
          <el-form-item
            v-if="this.submitParams.sysCode === 'HVPS' || this.submitParams.sysCode === 'IBPS'"
            label="原交易流水号/原批次号："
            prop="oriId"
          >
            <el-input v-model="submitParams.oriId" />
          </el-form-item>
          <el-form-item v-if="this.submitParams.sysCode === 'BEPS'" label="原交易流水号：" prop="oriId">
            <el-input v-model="submitParams.oriId" />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-form-item label="查询内容：" prop="inqContent">
            <el-input type="textarea" v-model="submitParams.inqContent" maxlength="256" show-word-limit />
          </el-form-item>
        </el-col>
      </el-row>

      <el-card
        class="form-card txnInfo-card"
        v-if="this.submitParams.sysCode === 'HVPS' && this.submitParams.inqTypeHVPS === 'QA01'"
      >
        <div slot="header" class="label-header-msg">
          <span>银行承兑汇票</span>
        </div>

        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="接收行行号" prop="indirectRecver">
              <el-input v-model="submitParams.indirectRecver" @change="checkbankcode" />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label-width="20px">
              <el-button icon="el-icon-search" plain type="primary" @click="openBankBranchDialog">
                行名行号查询
              </el-button>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row type="flex">
          <el-col :span="24">
            <el-form-item label="接收行行名" prop="payeeBankName">
              <el-input v-model="submitParams.payeeBankName" :disabled="true" />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="票据号码" prop="noteNumber">
              <el-input v-model="submitParams.noteNumber" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="承兑日期" prop="acceptDate">
              <el-date-picker
                v-model="submitParams.acceptDate"
                style="width: 100%"
                type="date"
                value-format="yyyyMMdd"
              />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="出票日期" prop="issueDate">
              <el-date-picker
                v-model="submitParams.issueDate"
                style="width: 100%"
                type="date"
                value-format="yyyyMMdd"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="汇票到期日期" prop="draftMaturity">
              <el-date-picker
                v-model="submitParams.draftMaturity"
                style="width: 100%"
                type="date"
                value-format="yyyyMMdd"
              />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="出票人全称" prop="issueName">
              <el-input v-model="submitParams.issueName" />
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="收票人全称" prop="payeeName">
              <el-input v-model="submitParams.payeeName" />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="付款行全称" prop="payerBankName">
              <el-input v-model="submitParams.payerBankName" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-card>

      <el-row>
        <el-col :span="12">
          <el-form-item>
            <el-button type="primary" @click="submitForm" v-loading.fullscreen.lock="loading">提 交</el-button>
            <el-button @click="refresh">重 置</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>

    <bank-branch-dialog ref="bankBranchDialog" @confirm="confirmBankBranch"></bank-branch-dialog>
  </div>
  </div>
</template>

<script>
import { businessStatQryEntrySave } from "@/api/cnaps/ccms/316";
import { listPageMixin } from "@/libs/listPageMixin";
import BankBranchDialog from "@/views/components/BankBranchDialog";
import { getBankInfByBankCode } from "@/api/cnaps/common/bankInfo";
import { ccmsInquiryEntrySave } from "@/api/cnaps/ccms/314";

export default {
  name: "ccmsInquiryEntry",
  mixins: [listPageMixin],
  components: { BankBranchDialog },
  computed: {
    condition() {
      return {
        sysCode: true,
        inqType: this.submitParams.sysCode === "BEPS" || this.submitParams.sysCode === "IBPS",
        inqTypeHVPS: this.submitParams.sysCode === "HVPS",
        oriId: true,
        inqContent: true,
        indirectRecver: this.submitParams.sysCode === "HVPS" && this.submitParams.inqTypeHVPS === "QA01",
        payeeBankName: this.submitParams.sysCode === "HVPS" && this.submitParams.inqTypeHVPS === "QA01",
        noteNumber: this.submitParams.sysCode === "HVPS" && this.submitParams.inqTypeHVPS === "QA01",
        acceptDate: this.submitParams.sysCode === "HVPS" && this.submitParams.inqTypeHVPS === "QA01",
        issueDate: this.submitParams.sysCode === "HVPS" && this.submitParams.inqTypeHVPS === "QA01",
        draftMaturity: this.submitParams.sysCode === "HVPS" && this.submitParams.inqTypeHVPS === "QA01",
        issueName: this.submitParams.sysCode === "HVPS" && this.submitParams.inqTypeHVPS === "QA01",
        payeeName: this.submitParams.sysCode === "HVPS" && this.submitParams.inqTypeHVPS === "QA01",
        payerBankName: this.submitParams.sysCode === "HVPS" && this.submitParams.inqTypeHVPS === "QA01",
      };
    },
    send() {
      const data = {};
      for (let [key, value] of Object.entries(this.submitParams)) {
        if (this.condition[key]) data[key] = value;
      }

      return data;
    },
  },

  data() {
    return {
      // 录入参数
      submitParams: {
        sysCode: undefined,
        inqType: undefined,
        inqTypeHVPS: undefined,
        oriId: undefined,
        inqContent: undefined,
        indirectRecver: undefined,
        payeeBankName: undefined,
        noteNumber: undefined,
        acceptDate: undefined,
        issueDate: undefined,
        draftMaturity: undefined,
        issueName: undefined,
        payeeName: undefined,
        payerBankName: undefined,
      },

      loading: false,
      //
      searchFormDictList: ["ORGAN_SYSTYPE_BRANCH", "INQ_TYPE_314", "INQ_TYPE_314_HVPS"],

      rules: {
        sysCode: { required: true, message: "请输入系统编号", trigger: "blur" },
        inqType: { required: true, message: "请输入查询类型", trigger: "blur" },
        inqTypeHVPS: { required: true, message: "请输入查询类型", trigger: "blur" },
        oriId: [
          { required: true, message: "请输入原交易流水号", trigger: "blur" },
          { max: 20, message: "长度不超过20位", trigger: "blur" },
        ],
        inqContent: [
          { required: true, message: "请输入查询内容", trigger: "blur" },
          { max: 256, message: "长度不超过256位", trigger: "blur" },
        ],
        indirectRecver: [
          { required: true, message: "请输入接收行行号", trigger: "blur" },
          { max: 14, message: "长度不超过14位", trigger: "blur" },
        ],
        noteNumber: [
          { required: true, message: "请输入票据号码", trigger: "blur" },
          { max: 14, message: "长度不超过32位", trigger: "blur" },
        ],
        acceptDate: { required: true, message: "请输入承兑日期", trigger: "blur" },
        issueDate: { required: true, message: "请输入出票日期", trigger: "blur" },
        draftMaturity: { required: true, message: "请输入汇票到期日期", trigger: "blur" },
        issueName: [
          { required: true, message: "请输入出票人全称", trigger: "blur" },
          { max: 14, message: "长度不超过60位", trigger: "blur" },
        ],
        payeeName: [
          { required: true, message: "请输入收票人全称", trigger: "blur" },
          { max: 14, message: "长度不超过60位", trigger: "blur" },
        ],
        payerBankName: [
          { required: true, message: "请输入付款行全称", trigger: "blur" },
          { max: 14, message: "长度不超过60位", trigger: "blur" },
        ],
        payeeBankName: { required: true, message: "请输入接收行行名", trigger: "blur" },
      },
    };
  },
  mounted() {},
  methods: {
    //行名行号返回
    confirmBankBranch(fromFlag, row) {
      console.log("row", row);
      this.$set(this.submitParams, "indirectRecver", row.bankCode);
      this.$set(this.submitParams, "payeeBankName", row.orgFullname);
    },
    /** 提交按钮 */
    submitForm: function () {
      this.$refs["submitParams"].validate((valid) => {
        if (valid) {
          this.loading=true;
          ccmsInquiryEntrySave(this.send)
            .then((response) => {
              this.msgSuccess("录入成功");
              this.$alert(`CORE_ID: ${response.result.rspId}`, "生成交易流水号", {
                confirmButtonText: "确定",
                //刷新一下查询列表
                callback: (action) => {
                },
              });
              this.refresh();
              this.loading = false;
            })
            .catch((err) => {
              this.loading = false;
            });
        }
      });
    },
    //点击重置按钮
    refresh() {
      this.resetForm("submitParams");
    },

    //行名行号查询
    openBankBranchDialog(fromFlag = "") {
      this.$refs.bankBranchDialog.show(fromFlag);
    },

    //接收行行号输入查询
    checkbankcode: function () {
      var indirectRecver = this.submitParams.indirectRecver;
      getBankInfByBankCode(indirectRecver)
        .then((response) => {
          if (response.code == "S" && response.result !== null && response.result !== undefined) {
            this.$set(this.submitParams, "indirectRecver", response.result.bankCode);
            this.$set(this.submitParams, "payeeBankName", response.result.orgFullname);
          } else {
            this.msgError("无行名行号记录");
            this.$set(this.submitParams, "indirectRecver", null);
            this.$set(this.submitParams, "payeeBankName", null);
          }
        })
        .catch((err) => {
          this.msgError("无行名行号记录");
          this.$set(this.submitParams, "indirectRecver", null);
          this.$set(this.submitParams, "payeeBankName", null);
        });
    },
  },
};
</script>
